<template>
  <div class="container">
    <MyNavBar></MyNavBar>
    <MyCarousel></MyCarousel>
    <div class="index_container">
      <div class="article-list">
        <!---这里先显示轮播图-->
        <!--这里显示最新更新的博文组件-->
        <TopArticleContainer :catalog="'博文'" :icon="'el-icon-document-copy'"></TopArticleContainer>
        <TopArticleContainer :catalog="'码道'" :icon="'el-icon-s-promotion'"></TopArticleContainer>
      </div>
      <div class="article-list" style="margin-top: 20px">
        <MyTopicCourse></MyTopicCourse>
      </div>
    </div>
    <MyFooter></MyFooter>
  </div>
</template>

<script>

import MyNavBar from "@/components/MyNavBar.vue";
import MyCarousel from "@/components/MyCarousel.vue";
import TopArticleContainer from "@/components/TopArticleContainer.vue";
import MyTopicCourse from "@/components/MyTopicCourse.vue";
import MyFooter from "@/components/MyFooter.vue";

// 完整引入outils工具类
const outils = require('outils');

export default {
  name: "IndexView",
  components: {
    MyNavBar,
    MyCarousel,
    TopArticleContainer,
    MyTopicCourse,
    MyFooter
  },

  data(){
    return{
      currentLoginUserInfo:{}
    }
  },
  mounted() {
    /*
    console.log(0.1+0.2);
    console.log(0.5-0.2);*/

    //打印当前登录成功的用户对象。
    //this.currentLoginUserInfo = JSON.parse(localStorage.getItem("currentLoginUserInfo"));
    //console.log("-----------当前登录成功的用户对象是----------")
    //console.log(this.currentLoginUserInfo);
    //从cookie取出，保存tokenName和tokenValue;
    let token_value = outils.getCookie("satoken");
    console.log("-----------satoken---------------");
    console.log(token_value);
  }

}
</script>

<style scoped>

.container {
  width: 100%;
  height: auto;
  margin: 0 auto;
}

.index_container {
  margin-top: 20px;
  text-align: center;
}

.article-list {
  width: 80%;
  margin: 0px auto;
  display: flex; /*弹性布局*/
  justify-content: space-around;
}
</style>